<template lang="pug">
	.register-wrap
		.register-input
			input-line(placeholder="请输入短信验证码" type="number" @getValue="getVerification" maxlength="6" mode="verification" codeType="5" time="120" :phone="phone")
			input-line(placeholder="请设置登录密码" type="text" @getValue="getPassword" maxlength="11" mode="showPassword" :password="true")
		.register-btn(@click="jumpToNext")
			main-button(text="注册并登入" :isActive="nextStepPass")
		main-agreement(agreementName="健康台州使用用户协议" :agreementUrl="agreementUrl" @getAgreementMode="check")
		.register-footer 台州市卫生和计划生育委员会 监制
</template>

<script>
import inputLine from '@/components/input-line'
import mainButton from '@/components/main-button'
import mainAgreement from '@/components/main-agreement'
import sendCode from '@/components/send-code'
export default {
	data() {
		return {
			nextStepPassPasswordData: false,
			nextStepPassVerificationData: false,
			checkData: false,
			phone: ''
		}
	},
	computed: {
		nextStepPass() {
			return (
				this.nextStepPassPasswordData &&
				this.nextStepPassVerificationData &&
				this.checkData
			)
		},
		agreementUrl() {
			let host = this.tools.chooseHost([
				'http://wx.jktz.gov.cn/',
				'http://114.215.211.66:567/'
			])
			return host + 'User/UserRules'
		}
	},
	onLoad() {
		Object.assign(this.$data, this.$options.data())
	},
	mounted() {
		this.phone = this.$route.query.phone.toString()
	},
	onPullDownRefresh() {},
	onPageScroll(e) {},
	methods: {
		jumpToNext() {
			if (this.nextStepPass) {
				this.register()
			}
		},
		check(check) {
			this.checkData = check
		},
		getPassword(text) {
			text = text.toString()
			this.pasWd = text
			this.nextStepPassPasswordData = text.length > 0
		},
		getVerification(text) {
			text = text.toString()
			this.code = text
			this.nextStepPassVerificationData = text.length >= 4
		},

		register() {
			this.wx.showLoading({
				title: '加载中'
			})
			this.api.tzApi
				.register({
					phone: this.phone,
					loginPassword: this.pasWd,
					verCode: this.code,
					macId: '1',
					macType: '3',
					recHealthId: ''
				})
				.then(data => {
					this.wx.hideLoading()
					if (data.responseFlag === '1') {
						this.wx.showToast({
							title: '注册成功'
						})
						this.wx.setStorage({
							key: 'userInfo',
							data: {
								memberNum: data.data.memberNum,
								accessToken: data.data.accessToken,
								phone: this.phone
							}
						})
						setTimeout(() => {
							this.$router.push({
								path: '/views/healthCard/index'
							})
						}, 1000)
					} else {
						this.wx.showToast({
							title: data.responseMessage,
							icon: 'none'
						})
					}
				})
				.catch(() => {
					this.wx.hideLoading()
				})
		}
	},
	components: {
		inputLine,
		mainButton,
		mainAgreement,
		sendCode
	}
}
</script>

<style lang="stylus">
	page
		background-color white!important
	.register-wrap
		.register-input
			margin-top 200px
			.placeholderClass
				font-size 36px
				line-height 50px
			input
				font-size 36px!important
				line-height 50px!important
		.register-btn
			width 690px
			height 92px
			margin 60px auto 0
			border-radius 46px
			overflow hidden
		.register-footer
			position fixed
			bottom 38px
			width 100%
			text-align center
			color grayFontColor
			font-size 24px
			line-height 34px
</style>
